import { useState, useEffect, useRef } from "react";

// 新建看板卡片
export const NewKanbanCard = ({ onSubmit }) => {
  const [title, setTitle] = useState('');
  const inputElem = useRef(null);
  useEffect(() => {
    inputElem.current.focus();
    console.log(inputElem);
  }, []);
  const handleChange = (evt) => {
    setTitle(evt.target.value);
  };
  const handleKeyDown = (evt) => {
    if (evt.key === "Enter") {
      inputElem.current = "你好";
      console.log(inputElem);
      // onSubmit(title);
      const newCard = {title,status:new Date().toString()}
      onSubmit(newCard)
    }
  };
  return (
    <li className="kanban-card">
      <h3>添加新卡片</h3>
      <div className="card-title">
        <input type="text" ref={inputElem} value={title} onChange={handleChange} onKeyDown={handleKeyDown} />
      </div>
    </li>
  );
};
